<template>
	<div class="container">
		<img class="lottery" src="https://yuncanting123.oss-cn-qingdao.aliyuncs.com/CHOUJIANG.jpg" alt="" @click="e_golottery" style="height:147px;width:100%;">
		<view class="search_no" v-if="!list.length">
			<view class="font_14">
				<text>暂无优惠券/(ㄒoㄒ)/~~</text>
			</view>
		</view>
		<div class="list" v-for="(item,index) in list" :key="index" @touchstart.native="showDeleteButton(item.id)" @touchend.native="clearLoop(item.id)">
			<div class="list_s">
				<div class="list_container">
					<div class="list_c">
						<div class="list_name" v-if="item.range==0">全平台通用红包</div>
						<div class="list_name" v-if="item.range==1">限本餐厅使用</div>
						<div class="list_time">领取时间：{{item.validityDate}}</div>
					</div>
					<div class="list_money">
						<span class="a">￥</span>
						<span class="mon">{{item.discounted}}</span>
					</div>
				</div>
			</div>
			<div class="list_title">
				<span>限登录和收餐手机号{{mobile}}使用</span>
			</div>
		</div>
		
	</div>

</template>

<script>
export default {
	data() {
		return {
			mobile: '',
			list: [],
			startX: 0, //触摸位置
			endX: 0, //结束位置
			moveX: 0, //滑动时的位置
			disX: 0, //移动距离
			deleteSlider: '', //滑动时的效果,使用v-bind:style="deleteSlider"
		}
	},
	onLoad() {
		this.mobile = wx.getStorageSync('userPhone')
		this.getLuckList()
	},
	onShow() {
		this.getLuckList()
	},
	methods: {
		/**
		 * @Description: ${去抽奖}
		 * @Param
		 * @Return
		 * @Author 焦政
		 * @Date 2018/11/21
		 * @Version 1.0
		 */
		e_golottery() {
			wx.navigateTo({url: '/pages/lottery/main'})
		},
		expiredClick() {
			wx.navigateTo({url: '/pages/expiredCoupon/main'})
		},
		/**
		 * 跳转商家页面
		 * @param id [String] 商家id
		 */
		itemClick(id) {
			wx.navigateTo({url: '/pages/shoppingCart/main'})
		},
/// 长按
showDeleteButton(e) {
	console.log(e)
	clearTimeout(this.Loop); //再次清空定时器，防止重复注册定时器
	this.Loop = setTimeout(function() {

	}.bind(this), 1000);
},
clearLoop(e) {
	clearTimeout(this.Loop);
},


		/**
		 * 获得商家代金券
		 * @private
		 */
		//获取优惠券列表
		getLuckList() {
			var userId = wx.getStorageSync('userId')
			let getParams = {
				url: '/miniprogramOrder/getLuck',
				method: 'post',
				data: {
					userId: userId,
				},
			}
			this.$JZWX(getParams).then(re => {
				console.log('asdasdas', re)
				this.list = re.data.list
			})
		},
	},
}
</script>

<style lang="scss" scoped>
.container {
	width: 100%;
	&:nth-child(1) {
		margin-top: 2px;
	}
	.search_no {
		height: 120px;
		background: #fff;
		.font_14 {
			text-align: center;
			height: 80px;
			line-height: 80px;
		}
	}
	.list {
		width: 95%;
		margin: auto;
		background: #fff;
		height: 186rpx;
		border-radius: 20rpx;
		margin-top: 20rpx;

		.list_s {
			height: 70px;

			.list_container {
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 100%;
				border-bottom: 1px dashed #f3f3f3;
				.list_c {
					padding: 23rpx;
					.list_name {
						color: red;
						font-size: 30rpx;
						font-family: '楷体';
					}
					.list_time {
						font-size: 20rpx;
						color: #cccccc;
						letter-spacing:2px;
					}
				}
				.list_money {
					padding-right: 10rpx;
					.a {
						font-size: 25rpx;
						color: red;
					}
					.mon {
						font-size: 30rpx;
						color: red;
					}
				}
			}
		}
		.list_title {
			font-size: 20rpx;
			font-family: '楷体';
			line-height: 28px;
			span {
				padding: 20rpx;
				color: #a2a2a2;
			}
		}
	}
}
</style>

